<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>layui的使用</title>
<link rel="stylesheet" href="${pageContext.request.contextPath }/layui/css/layui.css" media="all">
</head>
<body>
	<table id="demo" lay-filter="test"></table>

	<script src="${pageContext.request.contextPath }/layui/layui.js"></script>
	<script>
		layui.use('table', function() {
			var table = layui.table;

			//第一个实例
			table.render({
				elem : '#demo',
			//	height : 312,
				url : 'users' //数据接口
				,
				page : true //开启分页
				,
				cols : [ [ {
					type : 'checkbox',
					fixed : 'left'
				}, {
					field : 'userId',
					title : 'ID',
					width : 80,
					fixed : 'left',
					unresize : true,
					sort : true
				}, {
					field : 'userName',
					title : '用户名',
					width : 120,
				}, {
					field : 'userPwd',
					title : '密码',
					width : 150,
				}, {
					field : 'userSex',
					title : '性别',
					width : 80,
					edit : 'text'
				}, {
					field : 'userTel',
					title : '电话',
					width : 150,
					sort : true
				}, {
					field : 'userAddress',
					title : '地址'
				}] ]
			});

		});
	</script>
</body>
</html>